<template>
    <div class="box">
        <span class="geren">个人中心</span>
        <img src="https://img1.baidu.com/it/u=787132584,3819075437&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1736269200&t=449e5f57e8a216e53149792e380e97f7"
            alt="">
        <span class="name">账号管理</span>
    </div>
    <div>
        <van-cell-group>
            <van-cell title="我的订单" value="全部订单" />
        </van-cell-group>
        <van-tabs v-model:active="active">
            <van-tab title="待付款"></van-tab>
            <van-tab title="待发货"></van-tab>
            <van-tab title="待收货"></van-tab>
            <van-tab title="已完成"></van-tab>
            <van-tab title="详细内容"></van-tab>
        </van-tabs>
        <van-cell-group>
            <van-cell title="收货地址" />
            <van-cell title="我的资金卷" />
            <van-cell title="我的商品卷" />
            <van-cell title="我的发票" />
            <van-cell title="账户信息" />
            <van-cell title="关于我们" />
        </van-cell-group>
    </div>
</template>

<script setup>

</script>

<style lang="scss" scoped>
.box {
    position: relative;
    width: 100%;
    height: 150px;
    background-color: rgb(77, 130, 215);
}

.box>img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    position: absolute;
    margin-top: 56px;
}

.geren {
    position: absolute;
    margin-left: 20px;
    color: white;
}

.name {
    position: absolute;
    margin-left: 300px;
    margin-top: 56px;
    color: white;
}
</style>